<!DOCTYPE html>
<html lang="en">
<head>
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <title>WebRTC Camera</title>
    <style>
        body {
            margin: 0;
            padding: 0;
            font-family: Arial, Helvetica, sans-serif;
        }

        html, body, webrtc-camera {
            height: 100%;
            width: 100%;
        }

        ha-card {
            display: block;
        }
    </style>
</head>
<body>
<script type="module" src="/webrtc/webrtc-camera.js"></script>
<script type="module">
    const config = {};
    for (const [k, v] of new URLSearchParams(location.search)) {
        if (v === 'true') config[k] = true;
        else if (v === 'false') config[k] = false;
        else config[k] = v;
    }

    const card = document.createElement('webrtc-camera');
    card.setConfig(config);
    card.hass = {
        callWS: () => new Promise(resolve => {
            resolve('');
        }),
        hassUrl: () => location.origin + '/api/webrtc/ws?embed=1'
    };

    document.body.appendChild(card);
</script>
</body>
</html>
